<template>
  <el-form ref="ruleForm"
           class="ConsigneeDurationSet">
    <el-popover placement="bottom"
                width="500"
                trigger="hover">
      <div class="info-title">法定节假日说明：</div>
      <p>
        例如国庆节，国家规定10月1号、2号、3号为法定节日；10月4号、5号、6号、7号为假日
      </p>
      <ol class="info-style">
        <li>假日不能单独勾选，只能在法定节日勾选的情况下勾选</li>
        <li>
          节假日只勾选法定节日适用于部分收货方只休法定节日，假日为正常上班日
        </li>
      </ol>
      <div style="text-align: center">
        <img style="width: 400px"
             src="../../../static/images/date.png"
             alt="" />
      </div>
      <div slot="reference"
           style="width: 125px">
        <p>
          送货时效配置
          <i slot="reference"
             class="iconcaozuoshuoming iconfont"
             style="color: #ff6500"></i>
        </p>
      </div>
    </el-popover>
    <div class="tips">
      本公司创建的订单送货时效遇周六、周日、法定节假日顺延至勾选日第二天（即该订单在勾选日第二天23点59分59秒前到达或签收，送货时效为达标）；法定节假日的优先级高于周六、周日。
    </div>
    <el-form-item>
      <el-checkbox-group v-model="checkoutList">
        <el-checkbox v-for="(item, index) in timeList"
                     :key="index"
                     :label="item.label"
                     border></el-checkbox>
      </el-checkbox-group>
    </el-form-item>
    <span v-if="flag">
      <el-popover placement="top-start"
                  width="200"
                  trigger="hover"
                  content="当收货人扫码签收订单异常时，系统将通过语言或短信方式通知发货人">
        <div slot="reference"
             style="width: 125px">
          <p style="margin-top: 35px">
            签收异常
            <i class="iconcaozuoshuoming iconfont"
               style="color: #ff6500"></i>
          </p>
        </div>
      </el-popover>
      <el-divider></el-divider>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="是否短信通知">
            <el-switch v-model="sms" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="是否语音通知">
            <el-switch v-model="voice" />
          </el-form-item>
        </el-col>
      </el-row>
    </span>
    <span v-if="vflag">
      <el-popover placement="top-start"
                  width="200"
                  trigger="hover"
                  content="订单扫描签收并将场景证书生成后发送到收货方邮箱">
        <div slot="reference"
             style="width: 180px">
          <p style="margin-top: 35px">
            推送数字化电子回单
            <i class="iconcaozuoshuoming iconfont"
               style="color: #ff6500"></i>
          </p>
        </div>
      </el-popover>
      <el-divider></el-divider>
      <el-row :gutter="20">
        <el-col :span="6">
          <el-form-item label="是否推送">
            <el-switch v-model="pushCertConsignee" />
          </el-form-item>
        </el-col>
      </el-row>
    </span>
    <el-button type="primary"
               class="btn-primary"
               size="medium"
               :loading="false"
               @click="save">保存</el-button>
  </el-form>
</template>

<script>
import { consignee } from "@/api/index.js";

export default {
  name: 'ConsigneeDurationSet',
  props: {
    value: {
      type: Object,
      default: () => { }
    }
  },
  data () {
    return {
      flag: false,
      vflag: false,
      timeList: [
        { label: "周六" },
        { label: "周日" },
        { label: "法定节日" },
        { label: "假日" }
      ],
      checkoutList: [],
      sms: false,
      voice: false,
      pushCertConsignee: false,
      userInfo: sessionStorage.getItem('userInfo')
    };
  },
  computed: {
    currentColumn () {
      return this.value
    },
    user () {
      return JSON.parse(this.userInfo)
    }
  },
  created () {
    this.getConfig();
    if (this.currentColumn) {
      this.sms = this.currentColumn.sms === 1 ? true : false;
      this.voice = this.currentColumn.voice === 1 ? true : false;
      this.pushCertConsignee =
        this.currentColumn.pushCertConsignee === 1 ? true : false;
      if (
        this.currentColumn.timeType &&
        this.currentColumn.timeType.length > 0
      ) {
        let arr = [];
        this.currentColumn.timeType.map((item) => {
          if (item === 6) arr.push("周六");
          if (item === 0) arr.push("周日");
          if (item === 1) arr.push("法定节日");
          if (item === 2) arr.push("假日");
        });
        this.checkoutList = [...arr];
      }
    }
  },
  methods: {
    async getConfig () {
      let { code, data } = await consignee.getConfigCompany(this.user?.tenantId);
      if (code === 0 && data) {
        this.flag = data?.signAuth === "1" ? true : false;
        this.vflag = data.pushCertTenant === "1" ? true : false;
      }
    },
    async save () {
      // if (this.checkoutList.length < 1)
      //   return this.$message.warning("请选择送货时效");
      let arr = [];
      this.checkoutList.map((item) => {
        if (item === "周六") arr.push(6);
        if (item === "周日") arr.push(0);
        if (item === "法定节日") arr.push(1);
        if (item === "假日") arr.push(2);
      });
      let params = {
        consigneeId: this.currentColumn.consigneeId,
        pushCertConsignee: this.pushCertConsignee ? 1 : 0,
        sms: this.sms ? 1 : 0,
        voice: this.voice ? 1 : 0,
        timeType: arr
      };
      let response = await consignee.getConsigneeReceiving(params)
      let { message } = response
      this.$message.success(message)
      this.$emit("confirm");
      // this.$store.dispatch("table/submitFormContainerApi", params);
    }
  }
}
</script>

<style scoped>
.ConsigneeDurationSet {
  padding: 20px;
}
.tips {
  background: #eeeeee;
  padding: 10px;
  margin: 10px 0 20px;
  border-radius: 5px;
  line-height: 20px;
  font-size: 14px;
}
.btn-primary {
  margin-top: 30px;
}
</style>